<template>
	<view style="">
		<!-- <u-navbar :autoBack="true">
			<view class="u-nav-slot" slot="center">
				<view class="" @click="show = true" v-if="show">
					<zb-dropdown-menu :zIndex="89" @toggleItem="toggleItem(2)" ref="dropdown1" active-color="#1cb8a7">
						<zb-dropdown-item :options="option" v-model="value4" @change="change1" name="first"></zb-dropdown-item>
					</zb-dropdown-menu>
				</view>
				<view class="" v-else style="font-weight: 700;font-size: 16px;">
					家长嘱托
				</view>
			</view>
			
		</u-navbar> -->
		<!-- #ifdef MP-WEIXIN -->
		<u-navbar :placeholder="true" :isBack="true">
			<view class="u-nav-slot" slot="center">
				<view class="" @click="show = true" v-if="show">
					<zb-dropdown-menu :zIndex="89" @toggleItem="toggleItem(2)" ref="dropdown1" active-color="#1cb8a7">
						<zb-dropdown-item :options="option" v-model="value4" @change="change1"
							name="first"></zb-dropdown-item>
					</zb-dropdown-menu>
				</view>
				<view class="" v-else style="font-weight: 700;font-size: 16px;">
					家长嘱托
				</view>
			</view>
			<view class="u-nav-slot" slot="left">
				<u-icon name="arrow-left" @click.native.stop="goBack" size="24"></u-icon>
				<u-icon name="plus" size="24" @click.native.stop="goApply" v-if="$isPermission('entrust_add')"></u-icon>
			</view>

		</u-navbar>
		<!-- #endif -->
		<!-- #ifndef MP-WEIXIN -->
		<u-navbar :placeholder="true" :isBack="true">
			<view class="u-nav-slot" slot="left">
				<u-icon name="arrow-left" @click.native.stop="goBack" size="24"></u-icon>
			</view>
			<view class="u-nav-slot" slot="center">
				<view class="" @click="show = true" v-if="show">
					<zb-dropdown-menu :zIndex="89" @toggleItem="toggleItem(2)" ref="dropdown1" active-color="#1cb8a7">
						<zb-dropdown-item :options="option" v-model="value4" @change="change1"
							name="first"></zb-dropdown-item>
					</zb-dropdown-menu>
				</view>
				<view class="" v-else style="font-weight: 700;font-size: 16px;">
					家长嘱托
				</view>
			</view>
			<view class="u-nav-slot" slot="right">
				<u-icon name="plus" size="24" @click.native.stop="goApply" v-if="$isPermission('entrust_add')"></u-icon>
			</view>
		</u-navbar>
		<!-- #endif -->
		<view class="content">
			<view class="card" v-for="(item,i) in list" @click="goDetail(item)" :key="i">
				<view class="top">
					<view class="left">{{item.parentName}}</view>
					<view class="right">{{item.createTime}}</view>
				</view>
				<view class="bottom">{{item.content}}</view>
				<!-- <view class="state">
					未读
				</view> -->
			</view>
			<u-loadmore :status="status" />
		</view>
		<!-- <button v-if="!show"  @click="goApply" class="btn" ></button> -->
	</view>
</template>

<script>
	import {parentEntrustPage} from '@/api/entrust.js'
	export default {
		data() {
			return {
				value4: 0,
				option: [{
						text: '大一班',
						value: 0
					},
					{
						text: '大二班',
						value: 1
					},
					{
						text: '小一班',
						value: 2
					}
				],
				list: [],
				show: false,
				status: 'loadmore',
				params:{
					pageNum: 1,
					pageSize: 10,
				},
				pageMore:true,
			};
		},
		onLoad() {
			if (this.show) {

			} else {

			}
			this.parentEntrustPage()
		},
		methods: {
			pathRes(data){
				uni.showLoading({
					title: '正在加载...',
					mask: true
				});
				if (data.code == 0) {
					uni.hideLoading();
					if (data.data.list.length == 0) {
						// this.loadingType = 3;
						this.status='nomore'
						return;
					}
					if (data.data.isLastPage) {
						this.pageMore = false;
						this.list = this.list.concat(data.data.list);
						// this.loadingType = 2;
						this.status='nomore'
					} else {
						if (data.data.isFirstPage) {
							this.list = data.data.list;
						} else {
							
							this.list = this.list.concat(data.data.list);
							console.log('不是第一页',this.list)
						}
						this.params.pageNum++;
						// this.loadingType = 0;
					}
					console.log('this.listTable',this.list)
						
					console.log('显示数据',this.list)
				}else{
					this.$api.showTip(res.data.msg);
				}
			},
			async parentEntrustPage(){
				this.params.teacherId=this.$util.getUser().userId
				const {data}=await parentEntrustPage(this.params)
				console.log('datassss',data)
				if(data.code==0){
					this.pathRes(data)
				}else{
					this.$api.showTip('请稍后再试')
				}
			},
			goBack(){
				uni.switchTab({
					url: '/pages/tabbar/index/index'
				});
			},
			goApply() {
				uni.navigateTo({
					url: 'apply'
				})
			},
			change1(val) {
				console.log('===========', val, this.value1);
			},
			goDetail(it) {
				uni.navigateTo({
					url: 'detail?info='+JSON.stringify(it)
				})
			},
			toggleItem(val) {
				if (val === 1) {
					this.$refs.dropdown1.close();
				} else {
					// this.$refs.dropdown.close()
				}
			}
		}
	};
</script>

<style lang="less" scoped>
	/deep/.u-nav-slot {
		display: flex;
	}

	/deep/.uicon-plus {
		margin-left: 90rpx;
	}

	.state {
		position: absolute;
		right: 0;
		top: 0;
		width: 80rpx;
		height: 40rpx;
		text-align: center;
		background-color: #20C3B2;
		color: #fff;
		font-size: 22rpx;
		font-weight: bold;
		line-height: 40rpx;
		border-bottom-left-radius: 16rpx;
		border-top-right-radius: 16rpx;
	}

	/deep/.zb-dropdown-menu__bar {
		box-shadow: none;
		height: 100%;
	}

	/deep/.zb-dropdown-item {
		top: 44px !important;
	}

	// /deep/.u-button{
	// 	position: fixed;
	// 	bottom: 100rpx;
	// 	left: 30%;
	// 	width: 200rpx;
	// 	background-color: $uni-theme-color;
	// 	color: #fff;
	// 	margin-top: 30rpx;
	// }
	.content {
		
		padding: 20rpx;

		.card {
			position: relative;
			width: 100%;
			padding: 50rpx 25rpx;
			background-color: #fff;
			border-radius: 14rpx;
			box-sizing: border-box;
			margin-bottom: 20rpx;

			.top {
				display: flex;
				justify-content: space-between;
				margin-bottom: 15rpx;

				.left {
					font-weight: 700;
					font-size: 30rpx;
				}
			}
		}
	}

	.fixBtn {}
</style>